<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>RESTful实验室</title>
        <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
        <script>
            $(function () {
                $("#btnGet").click(function () {
                    $.ajax({
                        url:"/restful/request",
                        type:"get",
                        dataType:"json",
                        success:function (json) {
                            $("#message").text(json.message)
                        }
                    })
                })
            })

            $(function () {
                $("#btnPost").click(function () {
                    $.ajax({
                        url:"/restful/request/100",
                        type:"post",
                        dataType:"json",
                        success:function (json) {
                            $("#message").text(json.message+":"+json.requestId)
                        }
                    })
                })
            })

            $(function () {
                $("#btnPut").click(function () {
                    $.ajax({
                        url:"/restful/request",
                        type:"put",
                        dataType:"json",
                        success:function (json) {
                            $("#message").text(json.message)
                        }
                    })
                })
            })

            $(function () {
                $("#btnDelete").click(function () {
                    $.ajax({
                        url:"/restful/request",
                        type:"delete",
                        dataType:"json",
                        success:function (json) {
                            $("#message").text(json.message)
                        }
                    })
                })
            })

            $(function () {
                $("#btnPersons").click(function () {
                    $.ajax({
                        url:"/restful/persons",
                        type:"get",
                        dataType:"json",
                        success:function (json) {
                            console.info(json);
                            for (var i = 0; i <json.length ; i++) {
                                var p =json[i];
                                $("#divPersons").append("<h2>"+p.name+":"+p.age+":"+p.birthday+"</h2>");
                            }
                        }
                    })

                })
            })

        </script>
    </head>
    <body>
        <input type="button" id="btnGet" value="发送Get请求"><br/>
        <input type="button" id="btnPost" value="发送Post请求"><br/>
        <input type="button" id="btnPut" value="发送Put请求"><br/>
        <input type="button" id="btnDelete" value="发送Delete请求"><br/>

        <h1 id="message"></h1>

        <hr/>

        <input type="button"  id="btnPersons" value="查询所有人">
        <div id="divPersons" ></div>
        
    </body>
</html>